window.onload = function (){
   fullTable(emList);
}

/**
 * 将数组内容填充表格数据
 */
function fullTable(array){
    let str = "";
    array.forEach(n =>{
        str += `<tr><td>${n.code}</td><td>${n.name}</td>
                    <td>${n.money}</td><td>${n.sex}</td>
                    <td><input type="button" value="删除" onclick="del(${n.code})">
                    <input type="button" value="修改" onclick="findById(${n.code})"></td>
                    </tr>`;
    });
    $("data").innerHTML = str;
}

/**
 * 排序
 * @param sortName 排序属性
 */
var isSort = true;
function sortEmployee(sortName){
    if(isSort){
        emList.sort((a,b) => a[sortName] - b[sortName]);
    }
    else{
        emList.sort((a,b) => b[sortName] - a[sortName]);
    }
    isSort = !isSort;
    fullTable(emList);
}

/**
 * 删除
 * @param code 删除员工编号
 */
function del(code){
    //找到指定编号的下标
    let index = emList.findIndex(n => n.code == code);
    //删除指定下标的元素
    emList.splice(index,1);
    fullTable(emList);
}

/**
 * 按ID得到对象
 * @param id
 * @returns {HTMLElement}
 */
function $(id){
    return document.getElementById(id);
}

/**
 * 按姓名查询
 */
function findByName(){
    //得到文本框内容
    var nameStr = $("nameTxt").value;
    var newList = emList.filter(n => n.name.indexOf(nameStr) != -1);
    fullTable(newList);
}

/**
 * 显示添加弹出框
 */
function showAddDiv(){
    $("addDiv").style.visibility = "visible";
}

/**
 * 添加
 */
function add(){
    if(checkAdd() == false){
        return;
    }

    var obj = {code:$("codeTxt").value,name:$("emNameTxt").value,
        money:$("moneyTxt").value,sex:$("sexTxt").value};
    emList.push(obj);
    fullTable(emList);
    $("addDiv").style.visibility = "hidden";
}

function checkAdd(){
    return checkCode() & checkName() & checkMoney() & checkSex();
}

function checkCode(){
    var ispass = checkFormElement(/^\d+$/,'codeTxt','codeErrorSpan','编号只能是数字');
    if(ispass == false){
        return false;
    }
    var index = emList.findIndex(n => n.code == $('codeTxt').value);
    if(index != -1){
        $('codeErrorSpan').innerHTML = "编号已存在";
        $('codeErrorSpan').style.color = 'red';
        return false;
    }

    return true;
}
function checkName(){
    var rexp = /^[a-zA-Z\u4e00-\u9fa5]{2,}$/;
    return checkFormElement(rexp,'emNameTxt','nameErrorSpan','姓名只能是两位以上的汉字或字母');
}
function checkSex(){
    return checkFormElement(/^[男女]$/,'sexTxt','sexErrorSpan','性别只能是男或女');
}
function checkMoney(){
    return checkFormElement(/^\d{4,5}$/,'moneyTxt','moneyErrorSpan','工资为4-5位数字');
}

function checkFormElement(rexp,textId,spanId,errorInfo){
    if(rexp.test($(textId).value)){
        $(spanId).innerHTML = "验证通过";
        $(spanId).style.color = "green";
        return true;
    }
    else{
        $(spanId).innerHTML = errorInfo;
        $(spanId).style.color = "red";
        return false;
    }
}

/**
 * 按ID查询
 * @param code 工号
 */
function findById(code){
    //按工号查找员工对象
    var emObj = emList.find(n => n.code == code);
    //将员工对象信息赋值给网页元素
    $("codeSpan").innerHTML = emObj.code;
    $("nameSpan").innerHTML = emObj.name;
    $("updateMoneyTxt").value = emObj.money;
    $("sexSpan").innerHTML = emObj.sex;
    $("updateDiv").style.visibility = "visible";
}

/**
 * 修改
 */
function update(){
    //找到要修改的对象
    var emObj = emList.find(n => n.code == $("codeSpan").innerHTML);
    emObj.money = parseInt($("updateMoneyTxt").value);
    fullTable(emList);
    $("updateDiv").style.visibility = "hidden";
}